<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列队动画1</title>
    <style>
        #box1,#box2,#box3,#box4,#box5,#box6,#box7,#box8,#box9{
            width: 100px;
            height: 100px;
            background: #ff7a4d;
            margin:10px  auto;
            display: none;
        }
    </style>
</head>
<body>
<input type="button" id="btn" value="队列动画效果">
<div id="box1"></div>
<div id="box2"></div>
<div id="box3"></div>
<div id="box4"></div>
<div id="box5"></div>
<div id="box6"></div>
<div id="box7"></div>
<div id="box8"></div>
<div id="box9"></div>
</body>
</html>
<script src="js/jquery-1.10.1.js"></script>
<script>
    $(function () {
        //给button添加点击事件
        $("#btn").click(function () {
            //让box1显示，用时1秒
            $("#box1").show(1000,function boxShow() {
                //next方法，跟着下面的实行
                $(this).next().show(1000,boxShow)
            })
        })
    })
</script>